<template>
	<div class="location">
		<div class="location1" v-for='item in likeList' @click='cd(item.imgUrl,item.title,item.msg,item.map)'>
			<div class="location_left">
				<img :src="item.imgUrl">
			</div>
			<div class="location_right">
				<div class="l1">{{item.title}}</div>
				<div class="l2"><i class="iconfont">&#xe81a;&#xe81a;&#xe81a;&#xe81a;&#xe81a;</i>{{item.msg}}条评论</div>
				<div class="l3"><p>￥<b>{{item.pre}}</b><i>起</i></p><span>{{item.map}}</span></div>
			</div>
		</div>
	</div>
</template>
<script>
	export default{
		props:[
			'likeList'
		],
		methods:{
			cd(imgUrl,title,pre,map){
				this.$router.push({
					path:'/article',
					query:{
						// arr:[{
							imgUrl:imgUrl,
							title:title,
							pre:pre,
							map:map
						// }]
					}
				})
			}
		}
	}
</script>
<style lang='stylus' scoped>
	.location{
		width: 100%;
		.location1{
			width: 100%;
			display: flex;
			padding:8px 10px;
			border-bottom: 1px solid #ccc;
			box-sizing: border-box;
		}
	}
	.location_left{
		width: 25%;
		img{
			width: 100%;
		}
	}
	.location_right{
		font-size: .4rem;
		width: 75%;
		padding:10px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		.l1{
			font-size: .45rem;
		}
		.l2{
			font-size: .35rem;
			color: #616161;
			i{
				color: #ffb436;
				margin-right: 6px;
				font-size:.4rem;
			}
		}
		.l3{
			display: flex;
			justify-content: space-between;
			font-size: .35rem;
			color:#ff8300;
			b{
				font-size: .47rem;
			}
			span{
				color:#616161;
			}
			i{
				font-style: normal;
				color: #616161;
				font-size: .35rem;
			}
		}
	}
</style>